import React, {Component} from 'react';
import {
  Modal,
  Form,
  Input,
  Spin,
  Select,
  DatePicker,
  Popconfirm,
  Row,
  Col,
  Button,
  Icon,
  Upload,Checkbox,
  message
} from 'antd';
import {hashHistory, Link} from 'dva/router';
import styles from './main.less';
import moment from 'moment'
const FormItem = Form.Item;
const dateFormat = 'YYYY-MM-DD';
const ButtonGroup = Button.Group;
const {BrowserWindow} = require('electron').remote

const fs = window.require('fs');
const path = window.require('path');

import _ from 'underscore';

const Option = Select.Option;
const Search = Input.Search;

var flag = true;
function handleChange(value) {
  console.log(`selected ${value}`);
}
import gathers from '../gather'

let sites = gathers

class _Filter extends Component {
  constructor(props) {
    super(props);

    this.state = {
      status: false
    };
    this.state.gathers = {}
    _.pairs(sites).map(d=>{
      let [name,clt] = d
      let cb = (status) => {
        let gathers = this.state.gathers
        gathers[name].status = status
        this.setState({gathers})
      }
      let gather = new clt(cb)
      this.state.gathers[name]={name,gather,status:{}}
    })
  }
  start() {
    console.log('start ...')
    _.values(this.state.gathers).map(d=>{
      if(d.checked){
          console.log('start ',d.name)
          d.gather.start()
      }
    })
    this.setState({status:true})
  }
  stop() {
    console.log('stop ...')
    _.values(this.state.gathers).map(d=>{
      console.log('stop ',d.name)
      d.gather.stop()
    })
    this.setState({status:false})
  }
  componentDidMount() {}
  render() {
    let siteIndex = 0
    return (
        <div className={styles.normal}>
          <div>
            <Row>
              <Col span={12}>采集控制面板</Col>
              <Col span={12}>
                <Row type="flex" justify="end">
                  <Col>

                  </Col>
                </Row>
              </Col>
            </Row>
            <Row style={{marginTop:'24px'}}>
              <Col span={8}>
                <Checkbox onClick={e=>{
                  _.values(this.state.gathers).map(d=> d.checked = e.target.checked)
                  this.setState({gathers:this.state.gathers})
                }}>全选 </Checkbox>
                <ButtonGroup>
                  <Button onClick={e => this.start()} type={this.state.status?'primary':'default'}>启动</Button>
                  <Button onClick={e => this.stop()} type={this.state.status?'default':'primary'}>停止</Button>
                </ButtonGroup>
              </Col>
            </Row>
            <Row style={{marginTop:'16px'}}>
              {_.values(this.state.gathers).map(d=>
                <Col key={++siteIndex} span={8}>
                  <Checkbox checked={d.checked} onChange={e=>{
                    _.values(this.state.gathers).filter(t=>t.name===d.name).map(d=> d.checked = e.target.checked)
                    this.setState({gathers:this.state.gathers})
                  }}>{siteIndex + ' .' + d.name.replace('__','.')}</Checkbox>
                  <Button type="dashed">{d.status.msg||'...'}</Button>
                  <Button type="dashed">{(d.status.current||'-') + ' / ' + (d.status.count||'-')}</Button>
                  <Icon type="scan" onClick={e=>{ hashHistory.push('/local/'+path.basename(d.gather.pathname)) }}/>
                  </Col>
              )}

            </Row>
          </div>
        </div>
    )
  }
}

export default Form.create()(_Filter);
